<template>
    <show-modal :title="title" :loading="loading" width="500px" @cancel="cancel" @submit="submit">
        <a-form-model ref="form" :model="form" :rules="rules" v-bind="layout">
            <a-form-model-item label="分类编码" prop="ctgCode">
                <a-input v-model="form.ctgCode" :disabled="form.id?true:false" placeholder="请输入分类编码" />
            </a-form-model-item>
            <a-form-model-item label="分类名称" prop="ctgName">
                <a-input v-model="form.ctgName" :maxLength="10" placeholder="请输入分类名称" />
            </a-form-model-item>
        </a-form-model>
    </show-modal>
</template>

<script>
import { rules } from './rules';
import { addInfo, updateInfo } from '@/api/product/type';

export default {
    name: 'CreateApply',
    props: {
        info: {
            type: Object,
            default: () => {}
        },
        parent: {
            type: Number | String,
            default: null
        }
    },
    data() {
        return {
            loading: false,
            rules,
            form: {
                id: '',
                parentId: '',
                ctgName: '',
                ctgCode: ''
            },
            layout: {
                labelCol: { span: 5 },
                wrapperCol: { span: 19 }
            }
        };
    },
    computed: {
        title() {
            if (this.parent) {
                return '新增子分类';
            }
            return this.info?.id ? '修改分类' : '新增分类';
        },
        disabled() {
            return this.info?.id ? true : false;
        }
    },
    created() {
        this.form = { ...this.form, ...this.info };
        this.form.parentId = this.parent;
        console.log(this.form);
    },
    methods: {
        submit() {
            this.$refs.form.validate(async valid => {
                if (valid) {
                    if (this.form.id) {
                        await updateInfo(this.form);
                        this.$message.success('修改成功!');
                    } else {
                        await addInfo(this.form);
                        this.$message.success('添加成功!');
                    }
                    this.$emit('submit');
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        //取消
        cancel() {
            this.$emit('cancel');
        }
    }
};
</script>

<style lang="scss" scoped></style>
